<template>
  <MrCustom bg-color="bg-gradual-blue " is-back>
    <template #backText>
      返回
    </template>
  </MrCustom>
  <view v-if="appointmentInfo" class="flex flex-direction flex-sub" style="height: 90vh">
    <view style="display: flex;flex: 1;flex-direction: column">
      <view class="solids padding bg-white radius-lg">
        <tui-steps :items="items" spacing="180rpx" :activeSteps="activeSteps"></tui-steps>
      </view>
      <uni-group title="预约信息" mode="card">
        <uni-list>
          <uni-list-item title="创建时间" :rightText="appointmentInfo.createTime"/>
          <uni-list-item title="预约类型" :rightText="getAppointmentType(appointmentInfo.type)"/>
        </uni-list>
      </uni-group>
      <uni-group title="患者信息" mode="card">
        <uni-list>
          <uni-list-item title="患者用户名" :rightText="appointmentInfo.patientUsername"/>
          <uni-list-item title="患者姓名" :rightText="appointmentInfo.patientName"/>
        </uni-list>
      </uni-group>
    </view>
    <!--    <view class="bg-white margin-xs padding radius-lg">-->
    <!--      <view class="flex flex-sub flex-direction">-->
    <!--        <view class="flex flex-sub justify-between">-->
    <!--          <view class="text-black">就诊结果</view>-->
    <!--          <view class="cuIcon-right text-gray"></view>-->
    <!--        </view>-->
    <!--        <view class=" flex flex-sub justify-between margin-top padding-top solid-top">-->
    <!--          <view class="text-black">回访患者</view>-->
    <!--          <view class="cuIcon-right text-gray"></view>-->
    <!--        </view>-->
    <!--      </view>-->
    <!--    </view>-->
    <view class="cu-bar foot bg-white" v-if="appointmentInfo.status===1||appointmentInfo.status===2||appointmentInfo.status===3||appointmentInfo.status===4">
      <view class="flex flex-sub justify-end">
        <button class="cu-btn lg margin-xs bg-red" v-if="appointmentInfo.status===1" @click="toUpload">取消</button>
        <button class="cu-btn lg margin-xs bg-yellow" v-if="appointmentInfo.status===2" @click="toUpload">上传信息</button>
        <button class="cu-btn lg  margin-xs bg-green" @click="toResult"
                v-if="appointmentInfo.status===3||appointmentInfo.status===4">就诊结果
        </button>
        <button class="cu-btn lg margin-xs bg-blue" v-if="appointmentInfo.status===3" @click="toReturnVisit">回访患者
        </button>
      </view>
    </view>
  </view>
</template>

<script setup lang="ts">
import {getAppointmentType} from "@/utils/common/myStandard";
import {onLoad} from "@dcloudio/uni-app";
import {ref} from "vue";
import api from "@/api";
import MrCustom from "@/components/common/MrCustom.vue";

const items = [
  {
    title: "已受理",
  }, {
    title: "进行中",
  }, {
    title: "待回访",
  }, {
    title: "已完成",
  }]
const activeSteps = ref(0)
const appointmentInfo = ref()
onLoad((option) => {
  appointmentInfo.value = JSON.parse(decodeURIComponent(option.appointmentInfo))
  activeSteps.value = appointmentInfo.value.status - 1
})

/**
 * 回访
 */
const toReturnVisit = () => {
  api.chat.createFriends({
    fromUsername: appointmentInfo.value.nurseUsername,
    fromName: appointmentInfo.value.nurseName,
    fromAvatar: appointmentInfo.value.nurseAvatar,
    toUsername: appointmentInfo.value.patientUsername,
    toName: appointmentInfo.value.patientName,
    toAvatar: appointmentInfo.value.patientAvatar,
  }).then(res => {
    console.log(res)
    let params = {
      chatFriends: res.data.data
    }
    uni.navigateTo({
      url: '/pages/common/chat/chat?params=' + encodeURIComponent(JSON.stringify(params)),
      success: () => {
        api.appointment.finish({
          id: appointmentInfo.value.id,
        })
      }
    })
  })
}
const toResult = () => {
  uni.navigateTo({
    url: '/pages/nurse/appointment/handle/result?appointmentInfo=' + encodeURIComponent(JSON.stringify(appointmentInfo.value))
  })
}


const toUpload = () => {
  uni.navigateTo({
    url: '/pages/nurse/appointment/handle/upload?appointmentInfo=' + encodeURIComponent(JSON.stringify(appointmentInfo.value))
  })
}

</script>

<style scoped>

</style>